<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Gallery</title>
    <link th:href="@{/css/bootstrap.css}" rel='stylesheet' type='text/css' />
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <!-- Custom Theme files -->
    <link th:href="@{/css/style.css}" rel='stylesheet' type='text/css' />
    <!-- Custom Theme files -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="Hotel Deluxe Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
    <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
    <!--webfont-->
    <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
    <script type="text/javascript" th:src="@{/js/jquery-1.11.1.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/login.js}"></script>
    <script th:src="@{/js/jqueryeasydropdown.js}"></script>
    <!------ Light Box ------>
    <link rel="stylesheet" th:href="@{/css/swipebox.css}">
    <script th:src="@{/js/jquery.swipebox.min.js}"></script>
    <script type="text/javascript">
        jQuery(function($) {
            $(".swipebox").swipebox();
        });
    </script>
    <!------ Eng Light Box ------>
    <script th:src="@{/js/wow.min.js}"></script>
    <link th:href="@{/css/animate.css}" rel='stylesheet' type='text/css' />
    <script>
        new WOW().init();
    </script>
<body>
<div class="header">
    <div class="col-sm-8 header-left">
        <div class="logo">
            <a href="index.html"><img th:src="@{/images/logo.png}" alt=""/></a>
        </div>
        <div class="menu">
            <a class="toggleMenu" href="#"><img th:src="@{/images/nav.png}" alt="" /></a>
            <ul class="nav" id="nav">
                <li><a th:href="@{/toUserLogin}">首页</a></li>
                <li><a th:href="@{/toRooms}">房间</a></li>
                <li><a href="news.html">新闻</a></li>
                <li><a href="/userOrder/userorder">我的订单</a></li>
                <li class="active"><a th:href="@{/EditUser/allHotel}">旗下酒店</a></li>
                <li><a th:href="@{/EditUser/findUserId}">个人中心</a></li>
                <li><a href="404.html">社区</a></li>
                <div class="clearfix"></div>
            </ul>
            <script type="text/javascript" th:src="@{/js/responsive-nav.js}"></script>
        </div>
        <!-- start search-->
        <div class="search-box">
            <div id="sb-search" class="sb-search">
                <form>
                    <input class="sb-search-input" placeholder="请输入你要查询的关键字" type="search" name="search" id="search">
                    <input class="sb-search-submit" type="submit" value="" >

                    <span class="sb-icon-search"> </span>
                </form>
            </div>
        </div>
        <div class="clearfix"></div>
    </div>
    <div class="col-sm-4 header_right">
        <div id="loginContainer"><a href="#" id="loginButton"><img th:src="@{/images/login.png}">
            <span th:if="${session.user != null}" th:text="${session.user.userName}"></span>
            <span th:if="${session.user == null}" >登录</span>
        </a>
            <a th:href="@{/userLogin/logout}"  style="float: right"><img th:src="@{/images/login.png}"><span>注销</span></a>
            <div id="loginBox">
                <form id="loginForm" >
                    <fieldset id="body">
                        <fieldset>
                            <label for="email">邮箱</label>
                            <input type="text" name="email" id="email">
                        </fieldset>
                        <fieldset>
                            <label for="password">密码</label>
                            <input type="password" name="password" id="password">
                        </fieldset>
                        <input type="submit" id="login" value="登录">
                        <label for="checkbox"><input type="checkbox" id="checkbox"> <i>记住密码</i></label>
                    </fieldset>
                    <span><a href="#">忘记密码?</a></span>
                </form>
            </div>
        </div>
        <div class="clearfix"></div>
    </div>
    <div class="clearfix"></div>
</div>
<div class="banner">
    <div class="container_wrap">
        <h1>目的地?</h1>
        <div class="dropdown-buttons">
            <div class="dropdown-button">
                <select name="cityName" id="cityName" class="dropdown"  tabindex="9" data-settings='{"wrapperClass":"metro"}'
                        style="
                   display: block;
                   font-size: 1.4em;
                   padding: 2px 60px 10px 5px;
                   overflow: hidden;
                   white-space: nowrap;
                   text-align: left;
                   font-weight: 300;
                   color: white;
                   border-radius: 1em 1em 1em;
                   background-color: #230d0d;
                   outline-color: transparent;">
                </select>
            </div>
            <div class="dropdown-button">
                <select name="hotelName" id="hotelName" class="dropdown" tabindex="9" data-settings='{"wrapperClass":"metro"}'
                        style="
                    display: block;
                    font-size: 1.4em;
                    padding: 2px 30px 10px 5px;
                    overflow: hidden;
                    white-space: nowrap;
                    text-align: left;
                    font-weight: 300;
                    color: white;
                    border-radius: 3em 3em 3em;
                    background-color:#230d0d;
                    outline-color: transparent;">

                </select>
            </div>
        </div>
        <form th:action="@{/hotelSearch/search}" th:method="POST" style="height: 100px;">
            <input type="text" value="输入酒店关键字"name="searchhotel"  onfocus="this.value = '';" onblur="if (this.value == '') {this.value = '输入目的地关键字';}"
                   style="margin:0 auto;
              width: 35%;">

            <button name="submit" type="submit" class=" btn1 btn-2 btn-2g" value="搜索" >搜索</button>

        </form>
        <div class="clearfix"></div>
    </div>
</div>
<div class="content_top">
    <div class="container">
        <div class="col-md-4 bottom_nav">
            <div class="content_menu">
                <ul>
                    <li class="active"><a href="#">评价高</a></li>
                    <li><a th:href="@{/hotelSearch/searchHotelByOrderCount}">预定最多</a></li>
                    <li><a th:href="@{/hotelSearch/searchHotelByOrderTime}">最近预定</a></li>
                </ul>
            </div>
        </div>
        <div class="col-md-4 content_dropdown1">
            <!--<div class="dropdown-button">-->
                <!--<select name="hotelType" id="hotelType" class="dropdown" tabindex="9" data-settings='{"wrapperClass":"metro"}'-->
                        <!--style="-->
                    <!--display: block;-->
                    <!--font-size: 1.4em;-->
                    <!--padding: 2px 30px 10px 5px;-->
                    <!--overflow: hidden;-->
                    <!--white-space: nowrap;-->
                    <!--text-align: left;-->
                    <!--font-weight: 300;-->
                    <!--color: white;-->
                    <!--border-radius: 3em 3em 3em;-->
                    <!--background-color:#230d0d;-->
                    <!--outline-color: transparent;"-->

                <!--</select>-->
            <!--</div>-->
        </div>

        <div class="col-md-4 filter_grid"style="float:right">
            <ul class="filter">
                <li class="fil">类型 :</li>
                <li><a href=""> <i class="icon1"> </i> </a></li>
                <li><a href=""> <i class="icon2"> </i> </a></li>
                <li><a href=""> <i class="icon3"> </i> </a></li>
                <li><a href=""> <i class="icon4"> </i> </a></li>
                <li><a href=""> <i class="icon5"> </i> </a></li>
            </ul>
        </div>
        <div class="col-md-4 content_dropdown1" style="float: right">
            <span>特色酒店</span>
            <div class="dropdown-button"  >
                <select name="hotelType" id="hotelType" class="dropdown" tabindex="9" data-settings='{"wrapperClass":"metro"}'
                        style="
                    display: block;
                    font-size: 1.4em;
                    padding: 2px 30px 10px 5px;
                    overflow: hidden;
                    white-space: nowrap;
                    text-align: left;
                    font-weight: 300;
                    color: white;
                    border-radius: 3em 3em 3em;
                    background-color:#ffbc38;
                    outline-color: transparent;">

                </select>

            </div>
        </div>
    </div>
</div>
<div class="living_middle" >
    <div class="container" >
        <div class="entertain_box wow fadeInLeft" data-wow-delay="0.4s" >
            <div class="col-md-3 grid_box"th:each="hotel:${hotel}"style="float: left; margin-bottom: 50px" id="show">
                <a th:href="@{/images/p1.jpg}" class="swipebox"  title="Image Title"> <img th:src="@{'/myfile/'+ ${hotel.fileName}}" style="width:285px;height:182px;  " class="img-responsive" alt=""><span class="zoom-icon"></span> </a>
                <div class="grid_box2">
                    <h4><a >酒店名称：<span th:text="${hotel.hotelName}"></span></a></h4>
                    <h4><a >酒店地址：<span th:text="${hotel.hotelAddress}"></span></a></h4>
                    <a th:href="@{/hotelSearch/searchRoom(id=${hotel.hotelId})}" class="btn3">查看房间>></a>
                    <a th:href="@{/EditUser/collectHotel(id=${hotel.hotelId})}" class="btn3">收藏酒店</a>
                    <a id="hotelId" hidden="hidden"><span th:value="${hotel.hotelId}"></span></a>
                </div>
            </div>


        </div>


    </div>


</div>
</div>
</div>
<div class="living_bottom">
    <div class="container">
        <h2 class="title block-title">Latest Posts</h2>
        <div class="col-md-6 post_left wow fadeInLeft" data-wow-delay="0.4s">
            <div class="mask1"><img th:src="@{/images/pic4.jpg}" alt="image" class="img-responsive zoom-img" /></div>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque cursus, sem eget sagittis sagittis, nisl magna sodales eros, ut feugiat velit velit non turpis. Cras eu nibh dapibus justo fringilla   <a href="single.html">More</a></p>
            <div class="divider"></div>
            <p class="field-content">30 Sep 2015</span></p>
        </div>
        <div class="col-md-6 post_left wow fadeInRight" data-wow-delay="0.4s">
            <div class="mask1"><img th:src="@{/images/pic5.jpg}" alt="image" class="img-responsive zoom-img" /></div>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque cursus, sem eget sagittis sagittis, nisl magna sodales eros, ut feugiat velit velit non turpis. Cras eu nibh dapibus justo fringilla   <a href="single.html">More</a></p>
            <div class="divider"></div>
            <p class="field-content">30 Sep 2015</span></p>
        </div>
    </div>
</div>
<div class="footer">
    <div class="container">
        <div class="footer_top">
            <h3>Subscribe to our newsletter</h3>
            <form>
		<span>
			<i><img th:src="@{/images/mail.png}" alt=""></i>
		    <input type="text" value="Enter your email" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Enter your email';}">
		    <label class="btn1 btn2 btn-2 btn-2g"> <input name="submit" type="submit" id="submit" value="Subscribe"> </label>
		    <div class="clearfix"> </div>
		</span>
            </form>
        </div>
        <div class="footer_grids">
            <div class="footer-grid">
                <h4>Ipsum Quis</h4>
                <ul class="list1">
                    <li><a href="contact.html">Contact</a></li>
                    <li><a href="#">Mirum est</a></li>
                    <li><a href="#">Placerat facer</a></li>
                    <li><a href="#">Claritatem</a></li>
                    <li><a href="#">Sollemnes </a></li>
                </ul>
            </div>
            <div class="footer-grid">
                <h4>Quis Ipsum</h4>
                <ul class="list1">
                    <li><a href="#">Placerat facer</a></li>
                    <li><a href="#">Claritatem</a></li>
                    <li><a href="#">Sollemnes </a></li>
                    <li><a href="#">Claritas</a></li>
                    <li><a href="#">Mirum est</a></li>
                </ul>
            </div>
            <div class="footer-grid last_grid">
                <h4>Follow Us</h4>
                <ul class="footer_social wow fadeInLeft" data-wow-delay="0.4s">
                    <li><a href=""> <i class="fb"> </i> </a></li>
                    <li><a href=""><i class="tw"> </i> </a></li>
                    <li><a href=""><i class="google"> </i> </a></li>
                    <li><a href=""><i class="u_tube"> </i> </a></li>
                </ul>
                <div class="copy wow fadeInRight" data-wow-delay="0.4s">
                    <p>Copyright &copy; 2016.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
                </div>
            </div>
            <div class="clearfix"> </div>
        </div>
    </div>
</div>
</body>
<script>

    window.onload = function(){
        $('#hotelType').on('change',function () {
            var hotelType = $(this).val();
            window.location.href='/hotelSearch/hotelShow?hotelType='+hotelType;
        })
        $.ajax({
            async:false,
            type:"POST",
            url:"/cityHotel/cityhotel",
            dataType:"json",
            data:{
                // warehouse: $("#cityName").val(),
            },
            success:function (data) {
                console.log(data);
                $("#cityName").append("<option>"+'选择城市'+"</option>option>");
                for (var i = 0; i<data.length;i++){
                    $("#cityName").append("<option >" + data[i].cityName + "</option>");

                }
            }
        })

        $.ajax({
            async:'true',
            type:"POST",
            url:"/cityHotel/hotel",
            dataType:"json",
            data:{
                // warehouse: $("#hotelName").val(),
            },
            success:function (data) {
                console.log(data);
                $("#hotelName").append("<option>"+'选择酒店'+"</option>option>");
                for (var i = 0; i<data.length;i++){
                    $("#hotelName").append("<option >" + data[i].hotelName + "</option>");

                }
            }
        })
        $.ajax({
            async:'true',
            type:"POST",
            url:"/hotelSearch/hotelType",
            dataType:"json",
            data:{
                // warehouse: $("#hotelName").val(),
            },
            success:function (data) {
                console.log(data);
                $("#hotelType").append("<option>"+'选择类型'+"</option>option>");
                for (var i = 0; i<data.length;i++){
                    $("#hotelType").append("<option >" + data[i].hotelType + "</option>");


                }
            }
        })

        if($('#hotelId').val()!=null){
            $('#showMore').hide();
        }
    }
</script>
</html>